<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s" %>
<%@ taglib uri="/sinopac-fn" prefix="fn" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="${fn:url('/form/CSS/tabs.css')}">
<link rel="stylesheet" href="${fn:url('/form/CSS/jquery-ui-1.10.1.css')}">
<script type="text/javascript" src="${fn:url('/js/jQuery/jquery-1.8.2.min.js')}"></script>
<script type="text/javascript" src="${fn:url('/js/jQuery/jquery_DOMWindow.js')}"></script>
<script type="text/javascript" src="${fn:url('/js/jQuery/jquery-ui-autocomplete.min.js')}"></script>
<script type="text/javascript" src="${fn:url('/js/tools/formUtil.js')}"></script>
<script>
	$(document).ready(function(){
		if(<s:property value="token_flag"/>){
			$.openDOMWindow({
		    	windowSourceID: '#errorForm',
		        height:150,  
		        width:370, 
		        overlay:1, 
		        overlayColor: '#A9A9A9',
		        windowPadding:20,
		        modal:1,
		        borderColor:'steelblue',
		        borderSize:'3', 
		        positionLeft:120, 
		        positionTop:-150,
		    });
		}
		
		$("#token_esn").autocomplete({
    		delay: 1000,
    		minLength: 1,
            source: function(request, response) {
                $.ajax({
                    url: "${fn:url('/ccroger/queryToken')}",
                    dataType: "json",
                    type: "post",
                    data: {"search":request.term},
                    success: function(data) {
				    	var dataset = [];
                    	var jo = eval("("+data+")");   
                        $(jo).each(function(i,item){ 
                        	dataset.push(item.tokenEsn);
                        });  
                        response(dataset);
                        $('.ui-menu-item').css("font-size","12px");
                        $('.ui-menu-item').css("font-weight","normal");
                    },
                });
            }
        });
	});
</script>
<title>申請配發 TOKEN</title>
</head>
<body>
	<%@ include file="/form/include/title.jsp" %>
	<div id="errorForm" style="display:none">
	<s:form>
		<table align="center">
			<tr>
				<td><p>TOKEN ESN <s:property value="token_esn"/> <s:property value="token_msg"/>，請重新輸入正確TOKEN ESN</p></td>
			</tr>
			<tr>
				<td align="center"><button type="submit">確定</button></td>
			</tr>
		</table>
	</s:form>
	</div>
	<s:form>
		<table class="table-style" align="center">
			<tr>
				<th>客戶ID</th>
				<th>TOKEN ESN</th>
			</tr>
			<tr>
				<td width="200"><s:property value="#session.customer_id"/></td>
				<td width="200"><input type="text" name="token_esn" size="32" maxlength="16" id="token_esn" Value="${token_esn}"/></td>
			</tr>
			<tr height="20" style="background-color: white"/>
			<tr>
				<td colspan="2" align="center" style="background-color: white">
					<s:submit action="allotmentToken" theme="simple" value="確定"/>
					<s:submit action="index" theme="simple" value="取消"/>
				</td>
			</tr>
		</table>
	</s:form>
</body>
</html>